<template>
  <van-nav-bar
    title="搜索列表"
    left-text="返回"
    left-arrow
    @click-left="onClickLeft"
  />
  <van-search
    v-model="value"
    show-action
    shape="round"
    placeholder="请输入搜索关键词"
    @search="onSearch"
    @keyup.enter="onSearch"
  >
    <template #action>
      <div @click="onSearch">搜索</div>
    </template>
  </van-search>
  <van-card
    v-for="item in searchList"
    :key="item.proid"
    :price="item.originprice + '.00'"
    :desc="item.desc"
    :title="item.proname"
    :thumb="item.img1"
    @click="onGoDetail(item.proid)"
  />
</template>

<script>
import { showToast } from "vant";
import { getSearchListApi } from "@/api/home";
export default {
  data() {
    return {
      value: this.$route.query.key,
      keyword: this.$route.query.key,
      searchList: [],
    };
  },
  created() {
    this.getSearchList();
  },
  methods: {
    onClickLeft() {
      this.$router.go(-1);
    },
    onSearch() {
      this.getSearchList();
    },
    onGoDetail(id) {
      this.$router.push("/Detail/" + id);
    },
    // 获取搜索列表
    async getSearchList() {
      let res = await getSearchListApi({
        keyword: this.value,
      });
      if (res.data.code === "200") {
        this.searchList = res.data.data;
        // console.log(res.data.data);
        showToast("搜索成功~");
      }
    },
  },
};
</script>

<style></style>
